<!--
 * @Author: your name
 * @Date: 2021-02-09 15:24:23
 * @LastEditTime: 2021-08-27 09:47:52
 * @LastEditors: dailuyu
 * @Description: In User Settings Edit
 * @FilePath: \TaskErrorManage\src\views\layoutpages\system\components\ProjectEdit.vue
-->
<template>
    <el-dialog
        :title="title"
        append-to-body
        destroy-on-close
        :model-value="showDialog"
        @close="closeDialog()"
    >
        <!-- <span>{{ rowData }}</span> -->
        <!-- 添加表单 -->
        <el-form
            :model="form"
            ref="formRef"
            :rules="rules"
            label-width="80px"
            :inline="false"
        >
            <el-form-item label="项目类型" prop="FId" v-if="props.isHidden">
                <el-radio
                    v-model="form.FId"
                    FId="0"
                    label="0"
                    @click="hidden = false"
                    >主项目</el-radio
                >
                <el-radio v-model="hidden" label="true">子项目</el-radio>
            </el-form-item>
            <el-form-item v-if="props.isHidden">
                <el-select
                    v-model="form.FId"
                    placeholder="请选择对应主项目"
                    v-if="hidden"
                >
                    <el-option
                        v-for="item in tableData"
                        :key="item.Id"
                        :label="item.Name"
                        :value="item.Id"
                    >
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="名称" prop="Name">
                <el-input v-model="Name" placeholder="" clearable></el-input>
            </el-form-item>
            <el-form-item label="描述" prop="Remark">
                <el-input v-model="Remark" placeholder="" clearable></el-input>
            </el-form-item>
            <el-form-item label="状态">
                <el-radio-group v-model="IsUse">
                    <el-radio-button :label="1"> 启用 </el-radio-button>
                    <el-radio-button :label="0"> 停用 </el-radio-button>
                </el-radio-group>
            </el-form-item>
        </el-form>
        <template v-slot:footer>
            <span v-bind="ButtonHidden">
                <el-button @click="closeDialog()">取消</el-button>
                <el-button
                    type="primary"
                    v-if="props.isHidden"
                    @click="addProject()"
                    >确定</el-button
                >
                <el-button
                    type="primary"
                    v-if="!props.isHidden"
                    @click="editProject(form)"
                    >确定</el-button
                >
            </span>
        </template>
    </el-dialog>
</template>

<script>
import { reactive, toRefs, ref } from "vue";
//import { EditProject } from "@/api/projectManage";
const rules = {
    Id: [
        {
            required: true,
            message: "请输入标识",
            trigger: "blur",
        },
    ],
    FId: [
        {
            required: true,
            message: "请输入父级标识",
            trigger: "blur",
        },
    ],
    Name: [
        {
            required: true,
            message: "请输入名称",
            trigger: "blur",
        },
    ],
    // UserId: [
    //     {
    //         required: true,
    //         message: "请输入创建人",
    //         trigger: "blur",
    //     },
    // ],
    // CreateDate: [
    //     {
    //         required: true,
    //         message: "请输入创建时间",
    //         trigger: "blur",
    //     },
    // ],
    Remark: [
        {
            required: true,
            message: "请输入描述",
            trigger: "blur",
        },
    ],
    // follow: [
    //     {
    //         required: true,
    //         message: "请输入跟踪",
    //         trigger: "blur",
    //     },
    // ],
    // priority: [
    //     {
    //         required: true,
    //         message: "请输入优先级",
    //         trigger: "blur",
    //     },
    // ],
    // assigneuserid: [
    //     {
    //         required: true,
    //         message: "请输入指派人员",
    //         trigger: "blur",
    //     },
    // ],
};
export default {
    props: {
        showDialog: {
            type: Boolean,
            default: true,
        },
        title: {
            type: String,
            default: "添加",
        },
        rowData: {
            type: Object,
            default: null,
        },
        fData: {},
        isHidden: Boolean,
        tableData: [],
    },
    emits: ["closeDialog"],
    setup(props, { emit }) {
        const { title, rowData } = toRefs(props);
        const closeDialog = () => {
            emit("closeDialog", false);
        };
        const editProject = () => {
            debugger;
            emit("editClick", form);
            closeDialog();
            //props.tableData.value.push(editform);
            // EditProject(data).then((response) => {});
        };
        const formRef = ref(null);
        const form = reactive({
            Id: "",
            FId: "0",
            Name: "",
            UserId: "",
            CreateDate: "",
            Remark: "",
            IsUse: 1,
            IsDelete: 0,
            children: [],
        });
        const {
            Id,
            FId,
            Name,
            UserId,
            CreateDate,
            Remark,
            IsUse,
            children,
            IsDelete,
        } = toRefs(form);
        const projectList = ref([]);

        /**
         * @description: 初始化
         * @param {*}
         * @return {*}
         */
        rowData.value &&
            ((Id.value = rowData.value.Id),
            (FId.value = rowData.value.FId),
            (Name.value = rowData.value.Name),
            (UserId.value = rowData.value.UserId),
            (CreateDate.value = rowData.value.CreateDate),
            (Remark.value = rowData.value.Remark),
            (IsUse.value = rowData.value.IsUse),
            (IsDelete.value = rowData.value.IsDelete),
            (children.value = rowData.value.children));
        /**
         * @description: 获取角色列表
         * @param {*}
         * @return {*}
         */
        const getProjectList = async () => {
            const { code, data } = await VE_API.system.projectList(
                {
                    page: 1,
                    limit: 10,
                },
                { Global: false }
            );
            if (code == "00") {
                const { list } = data;
                projectList.value = list;
            }
        };
        const getCurrentTime = () => {
            //构建方法
            var today = new Date(); //new 出当前时间
            var h = today.getFullYear(); //获取年
            var m = today.getMonth() + 1; //获取月
            var d = today.getDate(); //获取日
            var H = today.getHours(); //获取时
            var M = today.getMinutes(); //获取分
            var S = today.getSeconds(); //获取秒
            return h + "-" + m + "-" + d + " " + H + ":" + M + ":" + S; //返回 年-月-日 时:分:秒
        };
        const addProject = () => {
            form.CreateDate = getCurrentTime();
            form.UserId = 10;
            form.IsDelete = 0;
            emit("searchClick", form);
            debugger;
            closeDialog();
        };
        getProjectList();
        /**
         * @description:提交
         * @param {*}
         * @return {*}
         */
        const onSubmit = () => {
            formRef.value.validate(async (valid) => {
                if (valid) {
                    let res;
                    if (title.value == "添加") {
                        res = await VE_API.system.projectAdd(form);
                    } else {
                        res = await VE_API.system.projectEdit({
                            fid: rowData.value.fid,
                            id: rowData.value.id,
                            ...form,
                        });
                    }
                    const { code } = res;
                    if (code == "00") {
                        closeDialog();
                    }
                } else {
                    console.log("error submit!!");
                    return false;
                }
            });
        };
        return {
            props,
            closeDialog,
            onSubmit,
            rules,
            formRef,
            form,
            ...{
                Id,
                FId,
                Name,
                UserId,
                CreateDate,
                Remark,
                IsUse,
                IsDelete,
                children,
            },
            projectList,
            addProject,
            editProject,
        };
    },
    data() {
        return {
            fid: "0",
            options: [
                {
                    value: "1",
                    label: "1.普通",
                },
                {
                    value: "2",
                    label: "2.高",
                },
                {
                    value: "3",
                    label: "3.紧急",
                },
                {
                    value: "4",
                    label: "4.立刻",
                },
            ],
            value1: "",
            hidden: false,
            projectoptions: [
                {
                    projectvalue: "选项1",
                    projectlabel: "项目1",
                },
                {
                    projectvalue: "选项2",
                    projectlabel: "项目2",
                },
            ],
            projectvalue: "",
        };
    },
    methods: {
        getCurrentTime() {
            //构建方法
            var today = new Date(); //new 出当前时间
            var h = today.getFullYear(); //获取年
            var m = today.getMonth() + 1; //获取月
            var d = today.getDate(); //获取日
            var H = today.getHours(); //获取时
            var M = today.getMinutes(); //获取分
            var S = today.getSeconds(); //获取秒
            var temptime = h + "-" + m + "-" + d + " " + H + ":" + M + ":" + S; //返回 年-月-日 时:分:秒
            //document.getElementById("time").value = getCurrentTime();
            return temptime;
        },
        rowDbclick(row, column, event) {
            this.form = row;
            console.log(row, event, column);
            this.DialogVisible = true;
        },
    },
};
</script>

<style lang="scss" scoped></style>
